{{extend './layout/main.html'}}
{{block    'content'}}
     <style type="text/css">
    #box {
        background-color: rgba(0, 0, 0, 0.2);
        width: 300px;
        height: 360px;
        margin-top: 10px;
        overflow: hidden;
        padding: 0;
    }

    #box p {
        padding: 0 15px;
    }

    #lrc {
        margin-top: 130px;
        position: absolute;
        text-align: center;
        padding-top: 60px;
    }

    .gl {
        color: hotpink;
        background-color: red;
    }
    </style>
    <div class="aw-top-menu-wrap">
        <div class="container1">
            <!-- 用户栏 -->
            <div class="aw-user-nav">
                <a href="" class="aw-user-nav-dropdown">
                </a>
                <div class="aw-dropdown dropdown-list pull-right">
                    <ul class="aw-dropdown-list">
                        <li><a href="/logout"><i class="icon icon-logout"></i> 退出</a></li>
                    </ul>
                </div>
                <!-- 登陆&注册栏 -->
                <span>
        <a class="register btn btn-normal btn-success" href="">注册</a>
        <a class="login btn btn-normal btn-primary" href="">登录</a>
      </span>
                <!-- end 登陆&注册栏 -->
            </div>
            <!-- end 用户栏 -->
        </div>
    </div>
    <div class="container">
        <div class="page-header">
            <h1>首页--<small>我的音乐</small></h1>
        </div>
        <a href="/addMusic" class="btn btn-success">添加音乐</a>
    </div>
    <div class="container">
       <div class="row" style="display: flex;">
            <div style="flex: 3; margin-right: 10px;">
                <table class="table table-striped table-hover">
                    <thead>
                        <th>编号</th>
                        <th>歌曲标题</th>
                        <th>时长</th>
                        <th>歌手</th>
                        <th>编辑</th>
                        <th>删除</th>
                        <th>播放</th>
                    </thead>
                    <tbody class="list_container" id="list_container">
                        <tr>
                            <td>1</td>
                            <td>冰雨</td>
                            <td>刘德华</td>
                            <td>03:00</td>
                            <td><a href="">编辑</a></td>
                            <td><a class="del" href="">删除</a></td>
                            <td><span style="cursor:pointer" src="" class="glyphicon glyphicon-play-circle ply"></span></td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>冰雨2</td>
                            <td>刘德华</td>
                            <td>03:00</td>
                            <td><a href="">编辑</a></td>
                            <td><a class="del" href="">删除</a></td>
                            <td><span style="cursor:pointer" src="" class="glyphicon glyphicon-play-circle ply"></span></td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>冰雨3</td>
                            <td>刘德华</td>
                            <td>03:00</td>
                            <td><a href="">编辑</a></td>
                            <td><a class="del" href="">删除</a></td>
                            <td><span style="cursor:pointer" src="" class="glyphicon glyphicon-play-circle ply"></span></td>
                        </tr>
                        <tr>
                            <td>4</td>
                            <td>冰雨4</td>
                            <td>刘德华</td>
                            <td>03:00</td>
                            <td><a href="">编辑</a></td>
                            <td><a class="del" href="">删除</a></td>
                            <td><span style="cursor:pointer" src="" class="glyphicon glyphicon-play-circle ply"></span></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div style="flex: 2">
                <p>正在播放音乐:</p>
                <audio id="audio" autoplay src="" controls="controls">
                </audio>
                <div id="box" class="col-md-3">
                    <div id="lrc">
                    </div>
                </div>
            </div>
        </div>
    </div>

{{/block}}
